export function getLineAndBarOption (data, colors, config) {
  let label = []
  let legend = []
  colors = colors || ['#1890FF', '#2FC25B']
  const colorlen = colors.length
  let series = []
  const opt = Object.assign({
    label: [],
    rotate: 0,
    barWidth: 8,
    unit: '',
    title: '',
    legendPosition: 'bottom',
    legendSize: 12,
    left: 10,
    right: 10,
    showLabel: true,
    xAxisFontSize: 14,
    xMax: null,
    yAxisFontSize: 14,
    yMax: null
  }, config)
  let top = opt.unit ? 40 : 20
  let bottom = 20
  for (let i = 0; i < data.length; i++) {
    let item = data[i]
    const thisColor = colors[i % colorlen]
    item.name && legend.push(item.name)
    if (item.type === 'bar') {
      series.push({
        name: data[i].name,
        type: 'bar',
        barWidth: opt.barWidth,
        data: data[i].list,
        label: { normal: { show: opt.showLabel, position: 'top', fontSize: 9, color: '#989898' } },
        itemStyle: { normal: { color: thisColor } }
      })
    } else {
      series.push({
        name: item.name,
        symbol: 'emptyCircle',
        symbolSize: 7,
        smooth: true,
        showSymbol: true,
        type: 'line',
        data: item.list,
        itemStyle: { normal: { color: thisColor } }
      })
    }
  }
  if (opt.label.length) {
    label = opt.label
  } else {
    for (let i = 0; i < data[0].list.length; i++) {
      let item = data[0].list[i]
      label.push(item.name)
    }
  }
  let legendPos = { left: 'center' }
  if (legend.length) {
    if (opt.legendPosition === 'bottom') {
      bottom = bottom + 20
      legendPos = Object.assign({}, legendPos, { bottom: 10 })
    } else if (opt.legendPosition === 'top') {
      top = top + 20
      legendPos = Object.assign({}, legendPos, { top: 0 })
    }
  }
  return {
    title: { show: !!opt.title, text: opt.title, icon: 'circle', left: 'center', textStyle: { color: '#989898', fontSize: 16 } },
    legend: { data: legend, itemWidth: 10, itemHeight: 10, textStyle: { color: '#989898', fontSize: opt.legendSize }, ...legendPos },
    tooltip: { show: true, trigger: 'axis', axisPointer: { type: 'shadow' } },
    grid: { left: opt.left, top: top, bottom: bottom, right: opt.right, containLabel: true },
    dataZoom: [{
      type: 'slider',
      show: false,
      xAxisIndex: [0],
      start: 1,
      end: 140,
      zoomLock: false
    }, {
      type: 'inside',
      xAxisIndex: [0],
      start: 1,
      end: 80,
      zoomLock: false
    }],
    yAxis: {
      name: opt.unit,
      nameTextStyle: { color: '#FFF', fontSize: 12 },
      nameGap: 20,
      max: opt.yMax,
      type: 'value',
      axisLabel: { show: true, textStyle: { color: '#989898', fontSize: opt.yAxisFontSize } },
      axisLine: { show: false },
      axisTick: { show: false },
      splitArea: { show: false },
      splitLine: { show: true, lineStyle: { color: 'rgba(144, 144, 144, 0.2)', type: 'dashed' } }
    },
    xAxis: {
      type: 'category',
      min: 0,
      nameTextStyle: { color: '#FFF', fontSize: 12 },
      axisLabel: { margin: 15, textStyle: { color: '#989898', fontSize: opt.xAxisFontSize }, interval: 0, rotate: opt.rotate },
      axisLine: { show: true, lineStyle: { color: 'rgba(144, 144, 144, 0.2)' } },
      splitLine: { show: false },
      axisTick: { show: false },
      data: label
    },
    series: series
  }
}
